<template>
  <div id="app">
    <header class="head">
      <a class="back tl" href="javascript:history.back(-1)">
        <i class="el-icon-arrow-left"></i>
      </a>
      <a href="javascript:;" class="tc">
        <small class="font_18 co_f">修改菜单留样</small>
      </a>
      <a href="javascript:;" class="save">
        <button @click="submitForm()" type="primary">保存</button>
      </a>
    </header>
    <main>

      <div class="formcontent">
        <ul>
          <li>
            <span><em>*</em>活动名称</span>
            <div class="froms">
                <input type="text" name="keepSampleName" v-model="formName.keepSampleName" v-validate="'required'" :class="{'is-danger': errors.has('keepSampleName')}">
            </div>
          </li>
          <li>
            <span>餐次</span>
            <div class="froms">
              <el-select v-model="formName.timeType" placeholder="请选择">
                <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                </el-option>
              </el-select>
            </div>
          </li>
          <li>
            <span>留样菜品</span>
            <div class="froms">
              <input type="text" v-model="formName.dishesName">
            </div>
          </li>
          <li>
            <span>留样日期</span>
            <div class="froms">
              <el-input
                placeholder="请选择日期"
                icon="date"
                :disabled="true"
                v-model="formName.dataValue"
                @click="openPickerdDate()">
              </el-input>
              <mt-datetime-picker ref="picker" type="date" year-format="{value}年" month-format="{value} 月" date-format="{value} 日" v-model="pickerValue" @cancel="handleCanceDate" @confirm="handleConfirmDate"></mt-datetime-picker>
            </div>
          </li>

          <li>
            <span>留样重量（克/g）</span>
            <div class="froms">
              <input type="text" v-model="formName.keepSampleNum">
            </div>
          </li>
          <li>
            <span><em>*</em>留样人员</span>
            <div class="froms">
              <input type="text" name="msg" @click="handleClick" v-model="msg" v-validate="'required'" :class="{'is-danger': errors.has('msg')}">
              <mt-popup v-model="popupVisible" position="right" modal=false class="mint-popup-3">
                 <app-person v-on:listenToChildEvent="peopleClick" v-on:listencloseclick="clickmodl"></app-person>
              </mt-popup>
            </div>
          </li>

          <li>
            <span>备注{{this.detaillistData.keepSampleName}}</span>
            <div class="froms">
              <input type="text" v-model="formName.note">
            </div>
          </li>
        </ul>
      </div>
    </main>
  </div>
</template>

<script>
import Person from '@/components/institutionPerson'
import {
  KeepSampleUpdate,InstitutionPerson
} from '../../api/api';
import {
  Popup,DatetimePicker
} from 'mint-ui';
var moment = require('moment');
export default {
  name: 'add_mrcj',
  components: {
    'mt-popup': Popup,
    'mt-datetime-picker': DatetimePicker,
    'app-person':Person,
  },
  data() {
    return {
      getNowFormatDate: null,
      CriteriaList: [],
      detaillistData:[],
      options: [{
        value: '早餐',
        label: '早餐'
      }, {
        value: '午餐',
        label: '午餐'
      }, {
        value: '晚餐',
        label: '晚餐'
      }, {
        value: '午晚餐',
        label: '午晚餐'
      }, {
        value: '全天候',
        label: '全天候'
      }],
      //时间
      pickerValue: '',
      formName:{
        dataValue:this.$route.query.versionDate,
        keepSampleName:this.$route.query.keepSampleName,
        timeType:this.$route.query.timeType,
        dishesName:this.$route.query.dishesName,
        keepSampleNum:this.$route.query.keepSampleNum,
        note: this.$route.query.note,
        institutionPersonname:this.$route.query.enterprisePersonname,
        institutionPersonunid:this.$route.query.enterprisePersonunid,
      },
      value: '',
      //组件
      msg:this.$route.query.enterprisePersonname,
      seachtext: '',
      popupVisible: false,
      closeOnClickModal: false,
      getPerson: [],
      Enterprise: {},
      PageSize: 10,
      //获取详情信息
      
      verify: {
          msg:'required',
          formName: {
            keepSampleName: "required",
          },
      },  
    
    };
  },

  methods: {
    //获取日期
    openPickerdDate() {
      this.$refs.picker.open();
    },
    handleCanceDate() {
      let _this = this
      _this.pickerValue = _this.formName.dataValue
    },
    // 确定按钮 --- 判断该时间是否可选，若可选则把值赋给输入框的dataValue
    handleConfirmDate(val) {
      let _this = this
      _this.formName.dataValue = moment(val).format('YYYY-MM-DD')
    },

    //弹窗
    handleClick: function() {
      this.popupVisible = true
    },
    clickmodl: function() {
      this.popupVisible = false
    },
    //获取item
    peopleClick: function(data) {
      this.formName.institutionPersonname = data.name;
      this.formName.institutionPersonunid = data.unid;
      this.clickmodl();
      this.msg = this.formName.institutionPersonname
    },
    //提交方法
    submitForm: function() {
       this.$validator.validateAll().then((result) => {
        if (result) {
 //定义需要传给通讯的参数：string Data--实体MorningRecord的序列化值 string UserUnid--当前操作用户标识   stringify对象解析字符串 parse字符串解析对象
      let varQueryData = {
        Name: this.formName.institutionPersonname,
        Unid: this.formName.institutionPersonunid,
      }
      let varEnterpriseUnid = {
        Unid: JSON.parse(localStorage.getItem('auth')).enterpriseUnid,
        Name: JSON.parse(localStorage.getItem('auth')).enterpriseName,
      }
      let data = {
        Unid:this.$route.query.unid,
        KeepSampleTime:moment(this.formName.dataValue).format('YYYY-MM-DD 00:00:00'),
        keepSampleName: this.formName.keepSampleName,
        TimeType: this.formName.timeType,
        DishesName: this.formName.dishesName,
        KeepSampleNum:this.formName.keepSampleNum,
        Note: this.formName.note,
        EnterprisePerson:varQueryData,
        varEnterpriseUnid: this.varEnterpriseUnid,
      }
      let dataoption = {
        params: {
          Data: JSON.stringify(data),
          UserUnid: JSON.parse(localStorage.getItem('auth')).UserUnid,
        }
      }
       //调取接口
      KeepSampleUpdate(dataoption).then((res) => {
        if (res.success === true) {
          this.$message.success('保存成功');
            this.$router.go(-1);
        } else {
          this.$message.error(res.msg);
        }
      }).catch(function() {
        this.$message.error('网络异常。');
      })

        }
        else{
  this.$message.error('带*号为必填项，请确认填写格式正确');
        }
       })
     
     
    },
    
  },
   created() {

    },
  
}
</script>

<style lang="scss">

</style>
